<template>
    <div style="background: #fff; width: 100%; height: 100%">
        <div>
            <div class="QueryList">
                <div class="QueryItem">
                    发布单号：
                    <el-input placeholder="请输入内容" v-model="QueryInfo.id" clearable> </el-input>
                </div>
                <div class="QueryItem">
                    发布方：
                    <el-input placeholder="请输入内容" v-model="QueryInfo.publishBy" clearable> </el-input>
                </div>
                <div class="QueryItem">
                    发布类型：
                    <el-select v-model="QueryInfo.OrderType" placeholder="请选择">
                        <el-option v-for="(item, index) in OrderType" :key="index" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </div>
                <div class="QueryItem" style="width: 300px">
                    发布金额：
                    <el-input v-model="QueryInfo.orderAmount.start" placeholder="请输入内容"></el-input>
                    至
                    <el-input v-model="QueryInfo.orderAmount.end" placeholder="请输入内容"></el-input>
                </div>
                <div class="QueryItem">
                    发布状态：
                    <el-select v-model="QueryInfo.status" placeholder="请选择">
                        <el-option v-for="(item, index) in OrderStatus" :key="index" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </div>
            </div>
            <div class="QueryList">
                <div class="QueryItem" style="width: 350px">
                    发布时间：
                    <el-date-picker
                        v-model="QueryInfo.publishTime"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                    >
                    </el-date-picker>
                </div>
                <div class="QueryItem" style="width: 350px">
                    接单时间：
                    <el-date-picker
                        v-model="QueryInfo.TakeordersTime"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :formatter="dateConversion"
                    >
                    </el-date-picker>
                </div>
                <div class="QueryItem" style="width: 350px">
                    要求完成时间：
                    <el-date-picker
                        v-model="QueryInfo.deadlineTime"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :formatter="dateConversion"
                    >
                    </el-date-picker>
                </div>
                <div class="QueryItem">
                    预警：
                    <el-select v-model="QueryInfo.warnStatus" placeholder="请选择">
                        <el-option v-for="(item, index) in Earlywarning" :key="index" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </div>
            </div>
            <div class="QueryList">
                <div class="QueryItem">
                    上下架管理：
                    <el-select v-model="QueryInfo.shelfStatus" placeholder="请选择">
                        <el-option v-for="(item, index) in Shelves" :key="index" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </div>
                <div class="QueryItem">
                    接单用户：
                    <el-input placeholder="请输入内容" v-model="QueryInfo.orderReceiveUserId" clearable> </el-input>
                </div>
                <div class="QueryItem">
                    接单用户手机号：
                    <el-input placeholder="请输入内容" v-model="QueryInfo.orderReceiveUserPhone" clearable> </el-input>
                </div>
                <div class="QueryItem" style="width: 350px">
                  上传作品时间：
                    <el-date-picker
                        v-model="QueryInfo.uploadTime"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :formatter="dateConversion"
                    >
                    </el-date-picker>
                </div>
                <div class="QueryItem">
                    <div style="margin-right: 15px">
                        <el-button type="primary" @click="query">查询</el-button>
                    </div>
                    <div style="margin-right: 15px">
                        <el-button type="danger" @click="clear">清空</el-button>
                    </div>
                    <div style="margin-right: 15px">
                        <el-button type="info" @click="exportExcel">导出</el-button>
                    </div>
                    <div style="margin-right: 15px">
                        <el-button type="primary" @click="Addorder">发布订单</el-button>
                    </div>
                </div>
            </div>
        </div>
        <div style="padding: 0 15px">
            <el-table :data="tableData" border style="width: 100%">
                <el-table-column fixed prop="id" label="发布单号"> </el-table-column>
                <el-table-column fixed prop="publishBy" label="发布方"> </el-table-column>
                <el-table-column fixed prop="publishType" label="发布类型">
                    <template slot-scope="scope">
                        <div style="display: flex">
                            {{ scope.row.publishType == 'CLIP' ? '视频剪辑' : scope.row.publishType }}
                        </div>
                    </template>
                </el-table-column>
                <el-table-column fixed prop="orderAmount" label="发布订单金额(元)"> </el-table-column>
                <el-table-column fixed prop="orderRealAmount" label="实际结算金额(元)"> </el-table-column>
                <el-table-column fixed prop="publishTime" label="发布时间" :formatter="dateConversion"> </el-table-column>
                <el-table-column fixed prop="deadlineTime" label="要求完成时间" :formatter="dateConversion"> </el-table-column>
                <el-table-column fixed prop="uploadTime" label="上传作品时间" :formatter="dateConversion"> </el-table-column>
                <el-table-column fixed prop="warnStatus" label="预警">
                    <template slot-scope="scope">
                        <div style="display: flex">
                            {{ scope.row.warnStatus == 'YES' ? '违约单' : '正常' }}
                        </div>
                    </template>
                </el-table-column>
                <el-table-column fixed prop="status" label="发布单状态">
                    <template slot-scope="scope">
                        <div style="display: flex">
                            {{ getStatus(scope.row.status) }}
                        </div>
                    </template>
                </el-table-column>
                <el-table-column fixed prop="shelfStatus" label="上下架管理">
                    <template slot-scope="scope">
                        <div style="display: flex">
                            {{ getShelfStatus(scope.row.shelfStatus) }}
                        </div>
                    </template>
                </el-table-column>
                <el-table-column fixed prop="orderReceiveUserId" label="接单用户"> </el-table-column>
                <el-table-column fixed prop="orderReceiveUserPhone" label="接单用户手机号"> </el-table-column>

                <el-table-column fixed="right" label="操作" width="100">
                    <template slot-scope="scope">
                        <div style="display: flex">
                            <el-button
                                type="text"
                                size="small"
                                v-if="scope.row.shelfStatus == 'UP'"
                                style="color: red"
                                @click="takedowncheck('down', scope.row)"
                                >下架</el-button
                            >
                            <el-button type="text" size="small" @click="QueryDetle(scope.row)">查看</el-button>
                            <!-- <el-button type="text" size="small" style="color: green;" @click="takedowncheck('Up',scope.row)" v-else>上架</el-button> -->
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <div style="margin-top: 20px; display: flex; justify-content: flex-end">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :page-sizes="[10, 20, 50, 100]"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total_record"
                >
                </el-pagination>
            </div>
        </div>
        <el-dialog :title="dialogVisibleNewOrderTitle" :visible.sync="dialogVisibleNewOrder" width="60%">
            <div v-for="(item, index) in newOrderFrom" class="DialogFrom" :key="index">
                <div><span v-if="item.isMust" style="color: red">*</span>{{ item.name }}</div>
                <div v-if="item.Type == 'Input'" style="margin-left: 15px">
                    <el-input
                        v-model="item.value"
                        :type="item.inputType"
                        @input="(e) => setNumberInput(e, item)"
                        :disabled="!item.Whether"
                        placeholder="请输入内容"
                    ></el-input>
                </div>
                <div v-if="item.Type == 'Time'" style="margin-left: 15px">
                    <el-date-picker
                        v-model="item.value"
                        type="datetime"
                        :picker-options="pickerOptions"
                        start-placeholder="开始日期"
                        placeholder="选择日期时间"
                    >
                    </el-date-picker>
                </div>
                <div v-if="item.Type == 'textarea'" class="textareaBox" style="margin-left: 15px; width: 600px; border: 1px solid #ccc">
                    <!-- <quill-editor
                        class="editor"
                        v-model="item.value"
                        ref="myQuillEditor"
                        :options="editorOption"
                    
                    >
                    </quill-editor> -->
                    <Toolbar style="border-bottom: 1px solid #ccc" :editor="editor" :defaultConfig="toolbarConfig" :mode="mode" />
                    <Editor
                        style="height: 500px; overflow-y: hidden"
                        v-model="item.value"
                        :defaultConfig="editorConfig"
                        :mode="mode"
                        @onCreated="onCreated"
                    />
                    <!-- @blur="onEditorBlur($event)"
                        @focus="onEditorFocus($event)"
                        @change="onEditorChange($event)" -->
                    <!-- <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入内容" v-model="item.value">
                    </el-input> -->
                </div>
                <div v-if="item.Type == 'File'" style="margin-left: 15px">
                    <el-upload
                        class="upload-demo"
                        :action="baseApi + '/admin/file/v1/upload'"
                        :headers="headers"
                        accept=".rar,.zip,.doc,.docx,.pdf,.jpg,.jpeg,.png"
                        :limit="10"
                        :on-change="(e) => handleChange(e, item)"
                        :file-list="fileList"
                    >
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">
                            支持扩展名：.rar .zip .doc .docx .pdf .jpg.jpeg,png大小不可超过10MB,可上传不超过10份
                        </div>
                    </el-upload>
                </div>
                <div v-if="item.Type == 'ListInput'" class="ListInput">
                    <div style="margin-left: 15px; margin-right: 25px">
                        <el-input v-model="item.value" placeholder="请输入内容"></el-input>
                    </div>
                    <div v-for="(Options2, index) in item.Option" :key="index">
                        <div style="margin-right: 15px">{{ Options2.name }}</div>
                        <div>
                            <el-input v-model="Options2.value" placeholder="请输入内容"></el-input>
                        </div>
                    </div>
                </div>
                <div v-if="item.Type == 'label'" style="margin-left: 15px; display: flex; align-items: center">
                    <el-tag
                        :key="index2"
                        v-for="(tag, index2) in item.value"
                        closable
                        :disable-transitions="false"
                        @close="handleClose(item, tag)"
                        style="margin-right: 5px"
                    >
                        {{ tag }}
                    </el-tag>
                    <el-input
                        class="input-new-tag"
                        v-if="inputVisible"
                        v-model="inputValue"
                        ref="saveTagInput"
                        size="small"
                        @keyup.enter.native="handleInputConfirm(item)"
                        @blur="handleInputConfirm(item)"
                    >
                    </el-input>
                    <el-button v-else class="button-new-tag" size="small" @click="showInput">+ 添加标签</el-button>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="NewOrderCancle">取 消</el-button>
                <el-button type="primary" @click="NewOrder">确 定</el-button>
            </span>
        </el-dialog>
        <el-dialog title="查看" :visible.sync="detelDialog" width="60%">
            <div style="font-size: 28px; margin-bottom: 15px">{{ DetelInfo.orderTitle }}</div>
            <div style="border-bottom: 1px solid #e8e8e8; padding-bottom: 10px">
                <div style="display: flex; align-items: center">
                    <div style="margin-right: 15px">视频剪辑</div>
                    <div style="padding: 2px 5px; background: #f59a23; color: #fff; border-radius: 5px">
                        {{ getStatus(DetelInfo.status) }}
                    </div>
                    <div style="margin-left: 30px">{{ getTime(DetelInfo.publishTime) }}发布</div>
                    <div style="margin-left: 30px">{{ getTime(DetelInfo.deadlineTime) }}截止</div>
                </div>
                <div style="color: #f8b35a; font-size: 28px">￥{{ DetelInfo.orderAmount }}</div>
            </div>
            <div style="overflow: hidden; width: 100%">
                <div style="display: flex; align-items: center; margin-top: 20px; margin-left: 15px">
                    <div style="height: 20px; width: 3px; background: #01bfbf; margin-right: 15px"></div>
                    <div>标签</div>
                </div>
                <div style="display: flex; margin-left: 20px; margin-top: 15px">
                    <div
                        v-for="(item, index) in DetelInfo.orderTips"
                        :key="index"
                        style="
                            padding: 3px 5px;
                            border-radius: 5px;
                            background: #e6fffb;
                            border: 1px solid #87e8de;
                            color: #13c2c2;
                            margin-right: 15px;
                        "
                    >
                        {{ item }}
                    </div>
                </div>
            </div>
            <div>
                <div style="display: flex; align-items: center; margin-top: 20px; margin-left: 15px">
                    <div style="height: 20px; width: 3px; background: #01bfbf; margin-right: 15px"></div>
                    <div>任务详情</div>
                </div>
                <div style="margin-left: 20px" v-html="DetelInfo.orderDetail"></div>
            </div>
            <div>
                <div style="display: flex; align-items: center; margin-top: 20px; margin-left: 15px; margin-bottom: 10px">
                    <div style="height: 20px; width: 3px; background: #01bfbf; margin-right: 15px"></div>
                    <div>相关附件</div>
                </div>
                <div style="margin-left: 20px">
                    <div style="display: flex; margin-bottom: 10px" v-for="(item, index) in DetelInfo.attachmentFile" :key="index">
                        <div>{{ item.name }}</div>
                        <div style="color: green; cursor: pointer" @click="downLoad(item)">下载</div>
                    </div>
                </div>
            </div>
            <div>
                <div style="display: flex; align-items: center; margin-top: 20px; margin-left: 15px; margin-bottom: 10px">
                    <div style="height: 20px; width: 3px; background: #01bfbf; margin-right: 15px"></div>
                    <div>网盘链接</div>
                </div>
                <div style="margin-left: 20px">{{ DetelInfo.attachmentNetDisk }}提取码{{ DetelInfo.attachmentExtractCode }}</div>
            </div>
            <div>
                <div style="display: flex; align-items: center; margin-top: 20px; margin-left: 15px; margin-bottom: 10px">
                    <div style="height: 20px; width: 3px; background: #01bfbf; margin-right: 15px"></div>
                    <div>作品地址</div>
                </div>
                <div style="margin-left: 20px">{{ DetelInfo.worksNetDisk }}提取码{{ DetelInfo.worksExtractCode }}</div>
            </div>
            <div v-if="DetelInfo.workFile">
                <div style="display: flex; align-items: center; margin-top: 20px; margin-left: 15px; margin-bottom: 10px">
                    <div style="height: 20px; width: 3px; background: #01bfbf; margin-right: 15px"></div>
                    <div>用户上传作品附件</div>
                </div>
                <div style="margin-left: 20px">
                    <div style="display: flex; margin-bottom: 10px" v-for="(item, index) in DetelInfo.workFile" :key="index">
                        <div>{{ item.name }}</div>
                        <div style="color: green; cursor: pointer" @click="downLoad(item)">下载</div>
                    </div>
                </div>
            </div>
            <div style="display: flex; justify-content: center; margin-top: 20px">
                <el-button @click="detelDialog = false">取 消</el-button>
                <el-button type="primary" v-if="DetelInfo.status == 'UPLOADED_WORKS'" @click="orderreject(DetelInfo)">驳回</el-button>
                <el-button type="primary" v-if="DetelInfo.status == 'UPLOADED_WORKS'" @click="orderconfirm(DetelInfo)">确认完成</el-button>
                <el-button type="primary" @click="takeDownChecks(DetelInfo)">下架</el-button>
                <el-button type="primary" v-if="DetelInfo.status == 'PUBLISHED_PENDING_ORDERS'" @click="SetOrderInfo(DetelInfo)"
                    >编辑</el-button
                >
            </div>
            <span slot="footer" class="dialog-footer"> </span>
        </el-dialog>
        <el-dialog title="下架发布单" :visible.sync="takeDownCheckBox" width="30%">
            <div style="font-size: 22px">请确认是否下架该条发布单？</div>
            <div
                style="background: #fffbe6; border: 1px solid #ffe58f; border-radius: 5px; padding: 15px; margin-top: 10px"
                v-if="DetelInfo.status == 'PUBLISHED_PENDING_ORDERS'"
            >
                <i class="el-icon-warning" style="color: #ffaa00"></i>
                该发布单为已发布待接单状态请谨慎操作！
            </div>
            <div
                style="
                    background: #fffbe6;
                    border: 1px solid #ffe58f;
                    border-radius: 5px;
                    padding: 15px;
                    margin-top: 10px;
                    line-height: 20px;
                "
                v-else
            >
                <i class="el-icon-warning" style="color: #ffaa00"></i>
                该发布单已被{{ DetelInfo.orderReceiveUserPhone }}用户接单，请和用户协商一致后进行下架
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="takeDownCheckBox = false">取 消</el-button>
                <el-button type="primary" @click="takedownconfirm">确 定</el-button>
            </span>
        </el-dialog>

        <!-- 确认完成二次确认弹窗 -->
        <el-dialog title="提示" :visible.sync="dialogTableVisible" width="600px">
            <div class="text" style="margin-bottom: 20px">
                请确认本条发布单已完成,结算金额如下：本单为{{ DetelInfo.warnStatus == 'YES' ? '预警单' : '正常' }}订单
            </div>

            <el-input v-model="confirmSum" placeholder="请输入金额" style="margin-top: 20px"></el-input>
            <el-alert
                :title="`发布订单确认完成后钱款将打入用户账号` + DetelInfo.orderReceiveUserPhone + `,请查看作品谨慎操作`"
                type="warning"
                show-icon
                :closable="false"
                style="margin-top: 15px"
            >
            </el-alert>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogTableVisible = false">取 消</el-button>
                <el-button type="primary" :loading="confirmLoading" @click="confirm">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { MessageBox } from 'element-ui';
import { getListTime } from '@/utils/Time';
import { quillEditor } from 'vue-quill-editor';
import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
import request from '@/utils/request';
export default {
    computed: {
        // 日期格式转换
        dateConversion() {
            return (row, column) => {
                if (row[column.property] || (typeof row[column.property] === 'string' && row[column.property] !== '')) {
                    return new Date(row[column.property]).toLocaleString().replace(/\//g, '-');
                } else {
                    return row[column.property];
                }
            };
        }
    },
    data() {
        return {
            tableData: [],
            QueryInfo: {
                publishType: '',
                id: '',
                publishBy: '',
                orderAmount: { start: '', end: '' },
                status: '',
                publishTime: '',
                TakeordersTime: '',
                deadlineTime: '',
                warnStatus: '',
                shelfStatus: '',
                orderReceiveUserId: '',
                orderReceiveUserPhone: '',
                uploadTime:[]
            },
            OrderType: [
                {
                    value: '',
                    label: '剪辑'
                }
            ],
            OrderStatus: [
                {
                    value: null,
                    label: '全部订单'
                },
                // {
                //     value: 'TO_BE_AUDITED',
                //     label: '待审核'
                // },
                {
                    value: 'PUBLISHED_PENDING_ORDERS',
                    label: '已发布待接单'
                },
                {
                    value: 'RECEIVED_ORDERS',
                    label: '已接单'
                },
                {
                    value: 'COMPLETED',
                    label: '已完成'
                },
                {
                    value: 'UPLOADED_WORKS',
                    label: '已上传作品'
                },
                // {
                //     value: 'Reject_pending_review',
                //     label: '驳回待审核'
                // },
                {
                    value: 'REVISION_REJECTED',
                    label: '驳回修改中'
                }
            ],
            // 是、正常
            Earlywarning: [
                {
                    value: 'YES',
                    label: '是'
                },
                {
                    value: 'NORMAL',
                    label: '正常'
                }
            ],
            Shelves: [
                {
                    value: 'UP',
                    label: '上架'
                },
                {
                    value: 'DOWN',
                    label: '下架'
                }
            ],
            pageSize: 10,
            pageNum: 1,
            newOrderFrom: [
                {
                    name: '发布单类型',
                    key: '',
                    value: '视频剪辑',
                    Type: 'Input',
                    Whether: false,
                    isMust: false
                },
                {
                    name: '标题',
                    key: 'orderTitle',
                    value: '',
                    Type: 'Input',
                    Whether: true,
                    isMust: true
                },
                {
                    name: '发布单金额',
                    key: 'orderAmount',
                    value: '',
                    Type: 'Input',
                    Whether: true,
                    isMust: true,
                    Max: 999999,
                    inputType: 'number'
                },
                {
                    name: '截止时间',
                    key: 'deadlineTime',
                    value: '',
                    Type: 'Time',
                    Whether: true,
                    isMust: true
                },
                {
                    name: '标签',
                    key: 'orderTips',
                    value: [],
                    Type: 'label',
                    Whether: true,
                    isMust: true
                },
                {
                    name: '任务详情',
                    key: 'orderDetail',
                    value: '',
                    Type: 'textarea',
                    Whether: true,
                    isMust: true
                },
                {
                    name: '相关附件',
                    key: 'attachmentFile',
                    value: [],
                    Type: 'File',
                    Whether: true,
                    isMust: false
                },
                {
                    name: '相关附件网盘地址',
                    Option: [
                        {
                            name: '提取码',
                            key: 'attachmentExtractCode',
                            value: ''
                        }
                    ],
                    key: 'attachmentNetDisk',
                    value: '',
                    Type: 'ListInput',
                    Whether: true,
                    isMust: false
                },
                {
                    name: '作品上传网盘链接',
                    Option: [
                        {
                            name: '提取码',
                            key: 'worksExtractCode',
                            value: ''
                        }
                    ],
                    key: 'worksNetDisk',
                    value: '',
                    Type: 'ListInput',
                    Whether: true,
                    isMust: true
                }
            ],
            newOrderFromNull: [],
            dialogVisibleNewOrder: false,
            pickerOptions: {
                disabledDate(time) {
                    const date = new Date();
                    const oneday = date.getTime();
                    return time.getTime() < new Date().getTime() - 86400000;
                },
                selectableRange: (() => {
                    let data = new Date();
                    let hour = data.getHours();
                    let minute = data.getMinutes();
                    let second = data.getSeconds();
                    return [`${hour}:${minute}:${second} - 23:59:59`];
                })()
            },
            fileList: [],
            inputVisible: false,
            inputValue: '',
            total_record: 0,
            detelDialog: false,
            DetelInfo: {},
            baseApi: process.env.VUE_APP_BASE_API,
            headers: {
                accessToken: localStorage.getItem('accessToken')
            },
            takeDownCheckBox: false,
            takedownKes: '',
            dialogVisibleNewOrderTitle: '新增发布单',
            IsUserFbd: false,
            editor: null,
            html: '<p>hello</p>',
            toolbarConfig: {},
            editorConfig: { placeholder: '请输入内容...' },
            mode: 'default', // or 'simple'
            dialogTableVisible: false, //二次确认完成弹窗
            confirmSum: '', //二次弹窗确认内容
            orderType: '', //订单类型
            confirmLoading: false, //二次确认弹窗加载状态
            check: '' //查看选中的返回内容
        };
    },
    mounted() {
        this.getList();
    },
    methods: {
        handleClick(row) {
            console.log(row);
        },
        handleSizeChange(e) {
            this.pageSize = e;
            this.getList();
        },
        handleCurrentChange(e) {
            console.log(e);
            this.pageNum = e;
            this.getList();
        },
        getOrderTips(e) {
            console.log(eval('(' + e + ')'));
            return eval('(' + e + ')');
        },
        onCreated(editor) {
            this.editor = Object.seal(editor); // 一定要用 Object.seal() ，否则会报错
        },
        setNumberInput(value, input) {
            if (input.Max) {
                if (!(value <= input.Max)) {
                    this.$message.error(input.name + '不能大于' + input.Max + '元');
                    input.value = input.Max;
                    return;
                }
            }
        },
        getList(params) {
            const obj = {};
            const querylist = Object.keys(this.QueryInfo);
            for (let i = 0; i < querylist.length; i++) {
                if (this.QueryInfo[querylist[i]]) {
                    if (querylist[i] == 'orderAmount') {
                        if (this.QueryInfo[querylist[i]].start && this.QueryInfo[querylist[i]].end) {
                            obj[querylist[i]] = this.QueryInfo[querylist[i]];
                        }
                    } else {
                        obj[querylist[i]] = this.QueryInfo[querylist[i]];
                    }
                }
            }
            this.$store
                .dispatch('order/ReleaseOrderList', {
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                    ...obj
                })
                .then((res) => {
                    this.tableData = res.data.current_data;
                    this.total_record = res.data.total_record;
                    console.log(res.data.current_data);
                });
        },
        NewOrder() {
            console.log(this.newOrderFrom);
            let obj = {};

            for (let i = 0; i < this.newOrderFrom.length; i++) {
                if (this.newOrderFrom[i].key) {
                    if (this.newOrderFrom[i].key == 'attachmentFile') {
                        if (this.newOrderFrom[i].value) {
                            obj[this.newOrderFrom[i].key] = JSON.stringify(this.newOrderFrom[i].value);
                        }
                    } else if (this.newOrderFrom[i].key == 'attachmentNetDisk') {
                        if (this.newOrderFrom[i].value) {
                            obj[this.newOrderFrom[i].key] = this.newOrderFrom[i].value;
                            if (this.newOrderFrom[i].Option) {
                                for (let a = 0; a < this.newOrderFrom[i].Option.length; a++) {
                                    obj[this.newOrderFrom[i].Option[a].key] = this.newOrderFrom[i].Option[a].value;
                                }
                            }
                        }
                    } else {
                        if (!this.newOrderFrom[i].value || this.newOrderFrom[i].value.length == 0) {
                            console.log(this.newOrderFrom[i].key);
                            this.$message.error(this.newOrderFrom[i].name + '未输入');
                            return;
                        }
                        obj[this.newOrderFrom[i].key] = this.newOrderFrom[i].value;
                        if (this.newOrderFrom[i].Option) {
                            for (let a = 0; a < this.newOrderFrom[i].Option.length; a++) {
                                obj[this.newOrderFrom[i].Option[a].key] = this.newOrderFrom[i].Option[a].value;
                            }
                        }
                    }
                }
            }

            if (this.dialogVisibleNewOrderTitle == '编辑') {
                console.log(this.DetelInfo);
                obj.id = this.DetelInfo.id;
                obj.orderTips = JSON.stringify(obj.orderTips);
                // edit
                this.$store.dispatch('order/edit', obj).then((res) => {
                    console.log(res);
                    if (res.code == 0) {
                        this.dialogVisibleNewOrder = false;
                        this.newOrderFrom = this.newOrderFromNull;
                        this.$message.success('编辑成功');
                        this.detelDialog = false;
                        this.getList();
                        // const editor = this.editor;
                        // if (editor == null) return;
                        // editor.destroy();
                    }
                });
            } else {
                this.$store.dispatch('order/NewReleaseOrder', obj).then((res) => {
                    console.log(res);
                    if (res.code == 0) {
                        this.dialogVisibleNewOrder = false;
                        this.newOrderFrom = this.newOrderFromNull;
                        this.fileList = [];
                        this.$message.success('新增成功');
                        this.getList();
                        // const editor = this.editor;
                        // if (editor == null) return;
                        // editor.destroy();
                    }
                });
            }
        },
        Addorder() {
            // newOrderFrom
            this.newOrderFromNull = JSON.parse(JSON.stringify(this.newOrderFrom));
            this.newOrderFrom = this.newOrderFrom.slice(0, this.newOrderFrom.length - 1);
            this.dialogVisibleNewOrder = true;
        },
        NewOrderCancle() {
            this.dialogVisibleNewOrder = false;
            this.newOrderFrom = this.newOrderFromNull;
        },
        query() {
            this.pageNum = 1;
            let params = {};
            Object.keys(this.QueryInfo).forEach((item) => {
                this.QueryInfo[item] !== '' && (params[item] = this.QueryInfo[item]);
            });
            this.getList(params);
        },
        clear() {
            Object.keys(this.QueryInfo).forEach((item) => {
                this.QueryInfo[item] = '';
            });
            this.getList();
        },
        dialogVisibleNewOrderfasle() {
            const editor = this.editor;
            if (editor == null) return;
            editor.destroy();
            this.dialogVisibleNewOrder = false;
        },
        handleInputConfirm(item) {
            let inputValue = this.inputValue;
            if (inputValue) {
                item.value.push(inputValue);
            }
            this.inputVisible = false;
            this.inputValue = '';
        },
        showInput() {
            this.inputVisible = true;
            this.$nextTick((_) => {
                // this.$refs.saveTagInput.$refs.input.focus();
            });
        },
        handleChange(e, item) {
            if (e.response) {
                if (e.response.code == 0) {
                    this.$message.success('上传成功');
                    console.log(e);
                    item.value.push({
                        ...e.response.data,
                        name: e.name
                    });
                    console.log(item);
                } else {
                    this.$message.error('上传失败');
                    this.fileList.slice(0, this.fileList.length - 1);
                }
            }
        },
        handleClose(item, tag) {
            item.value.splice(item.value.indexOf(tag), 1);
        },
        QueryDetle(e) {
            console.log(e);
            this.dialogVisibleNewOrderTitle = '新增发布单';
            this.$store
                .dispatch('order/ReleaseDetail', {
                    id: e.id
                })
                .then((res) => {
                    console.log(res);
                    if (res.code == 0) {
                        this.DetelInfo = res.data;
                        if (this.DetelInfo.attachmentFile) {
                            this.DetelInfo.attachmentFile = JSON.parse(res.data.attachmentFile);
                        }
                        if (this.DetelInfo.orderTips) {
                            this.DetelInfo.orderTips = JSON.parse(res.data.orderTips);
                        }
                        if (this.DetelInfo.workFile) {
                            this.DetelInfo.workFile = JSON.parse(res.data.workFile);
                        }
                        this.detelDialog = true;
                    } else {
                        this.$message.error('查看失败');
                    }
                });
        },
        getStatus(e) {
            // 已接单
            // 已上传作品
            // 已完成
            //  驳回待审核
            // 驳回修改中
            // 违约

            switch (e) {
                case 'COMPLETED':
                    return '已完成';
                case 'PUBLISHED_PENDING_ORDERS':
                    return '已发布待接单';
                case 'UPLOADED_WORKS':
                    return '已上传作品';
                case 'TO_BE_AUDITED':
                    return '待审核';
                case 'REVISION_REJECTED':
                    return '驳回修改中';
                case 'Reject_pending_review':
                    return '驳回待审核';
                case 'RECEIVED_ORDERS':
                    return '已接单';
                default:
                    return e;
            }
        },
        getShelfStatus(e) {
            switch (e) {
                case 'DOWN':
                    return '下架';
                    break;
                case 'RE_UP':
                    return '待上架';
                    break;
                case 'UP':
                    return '上架';
                    break;
                default:
                    return e;
                    break;
            }
        },
        takedowncheck(e, item) {
            this.DetelInfo = item;
            console.log(item);
            if (e == 'down') {
                this.$store
                    .dispatch('userList/takeDownCheck', {
                        id: this.DetelInfo.id
                    })
                    .then((res) => {
                        console.log(res.data.checkCode);
                        this.takedownKes = res.data.checkCode;
                        this.takeDownCheckBox = true;
                    })
                    .catch((error) => {});
            } else {
            }
        },
        downLoad(item) {
            console.log(item);

            this.$store
                .dispatch('userList/download', {
                    filePath: item.filePath
                })
                .then((res) => {
                    console.log(res);
                    let url = window.URL.createObjectURL(res);
                    // 文件名
                    let fileName = item.originalName;
                    const a = document.createElement('a');
                    a.setAttribute('href', url);
                    a.setAttribute('download', fileName);
                    document.body.append(a);
                    a.click();
                    document.body.removeChild(a);
                });
        },
        getTime(e) {
            return getListTime(e);
        },
        orderreject(e) {
            this.$prompt('请确认本条发布单作品已上传,请确认是否驳回,并输入修改意见', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消'
            }).then(({ value }) => {
                this.$store
                    .dispatch('userList/orderreject', { id: e.id, rejectReason: value })
                    .then((res) => {
                        if (res.code == 0) {
                            this.$message.success('驳回成功');
                            this.detelDialog = false;
                            this.getList();
                        }
                    })
                    .catch((error) => {});
            });
        },
        orderconfirm(e) {
            this.orderType = this.getStatus(e.status);
            this.dialogTableVisible = true;
            this.confirmSum = '';
            this.check = e;
            // this.$prompt('请确认本条发布单已完成,结算金额如下：本单为' + this.getStatus(e.status) + '订单', '提示', {
            //     confirmButtonText: '确定',
            //     cancelButtonText: '取消'
            // })
            //     .then(({ value }) => {
            //         console.log('val', value);
            //         this.$store
            //             .dispatch('userList/orderconfirm', { id: e.id, orderRealAmount: value })
            //             .then((res) => {
            //                 console.log(res);
            //                 if (res.code == 0) {
            //                     this.$message.success('操作成功');
            //                     this.detelDialog = false;
            //                     this.getList();
            //                 }
            //             })
            //             .catch((error) => {});
            //     })
            //     .catch(() => {
            //         this.$message({
            //             type: 'info',
            //             message: '取消输入'
            //         });
            //     });
        },
        // 二次确认完成弹窗确认
        confirm() {
            if (this.confirmSum > this.DetelInfo.orderAmount) {
                this.$message.error('结算金额不可大于发布金额');
                return;
            }
            this.confirmLoading = true;
            this.$store
                .dispatch('userList/orderconfirm', { id: this.check.id, orderRealAmount: this.confirmSum })
                .then((res) => {
                    if (res.code == 0) {
                        this.$message.success('操作成功');
                        this.dialogTableVisible = false;
                        this.detelDialog = false;
                        this.confirmLoading = false;
                        this.getList();
                    }
                })
                .catch((error) => {
                    this.confirmLoading = false;
                });
        },
        takeDownChecks(e) {
            this.$store
                .dispatch('userList/takeDownCheck', {
                    id: this.DetelInfo.id
                })
                .then((res) => {
                    console.log(res.data.checkCode);
                    this.takedownKes = res.data.checkCode;
                    this.takeDownCheckBox = true;
                })
                .catch((error) => {});
        },
        takedownconfirm(e) {
            console.log(e);
            this.$store
                .dispatch('userList/takedownconfirm', {
                    id: this.DetelInfo.id,
                    checkCode: this.takedownKes
                })
                .then((res) => {
                    console.log(res);
                    if (res.code == 0) {
                        this.$message.success('操作成功');
                        this.detelDialog = false;
                        this.takeDownCheckBox = false;
                        this.getList();
                    }
                });
        },
        SetOrderInfo(e) {
            console.log(e);
            this.newOrderFromNull = JSON.parse(JSON.stringify(this.newOrderFrom));
            this.newOrderFrom = this.newOrderFrom.slice(0, this.newOrderFrom.length - 1);
            const obj = Object.keys(e);
            for (let i = 0; i < obj.length; i++) {
                for (let a = 0; a < this.newOrderFrom.length; a++) {
                    if (obj[i] == this.newOrderFrom[a].key) {
                        if (this.newOrderFrom[a].key == 'attachmentFile') {
                            this.fileList = e[obj[i]];
                        }
                        this.newOrderFrom[a].value = e[obj[i]];
                        if (this.newOrderFrom[a].Option) {
                            for (let b = 0; b < this.newOrderFrom[a].Option.length; b++) {
                                for (let c = 0; c < obj.length; c++) {
                                    if (this.newOrderFrom[a].Option[b].key == obj[c]) {
                                        this.newOrderFrom[a].Option[b].value = e[obj[c]];
                                    }
                                }
                            }
                        }
                    }
                }
            }
            console.log(this.newOrderFrom);

            this.dialogVisibleNewOrderTitle = '编辑';
            this.dialogVisibleNewOrder = true;
        },
        exportExcel() {
            const obj = {};
            const querylist = Object.keys(this.QueryInfo);
            for (let i = 0; i < querylist.length; i++) {
                if (this.QueryInfo[querylist[i]]) {
                    if (querylist[i] == 'orderAmount') {
                        if (this.QueryInfo[querylist[i]].start && this.QueryInfo[querylist[i]].end) {
                            obj[querylist[i]] = this.QueryInfo[querylist[i]];
                        }
                    } else {
                        obj[querylist[i]] = this.QueryInfo[querylist[i]];
                    }
                }
            }
            request({
                url: `/admin/release_order/v1/list-export`,
                method: 'post',
                data: obj,
                responseType: 'blob'
            }).then((res) => {
                console.log(res);
                let url = window.URL.createObjectURL(res);
                // 文件名
                let fileName = '发布单';
                const a = document.createElement('a');
                a.setAttribute('href', url);
                a.setAttribute('download', fileName);
                document.body.append(a);
                a.click();
                document.body.removeChild(a);
            });
            //
        }
    },
    watch: {
        dialogVisibleNewOrder(nevalue, oldvalue) {
            if (!nevalue) {
                this.newOrderFrom = this.newOrderFromNull;
            }
        }
    },
    components: {
        Editor,
        Toolbar
    }
};
</script>
<style src="@wangeditor/editor/dist/css/style.css"></style>
<style>
.el-upload--text {
    width: 80px;
    height: 32px;
}
</style>
<style scoped>
/* ::v-deep .el-dialog__body {
    padding: 0 20px;
}
 */
.QueryList {
    display: flex;
    padding-left: 30px;
}

.QueryItem {
    display: flex;
    height: 80px;
    width: 260px;
    align-items: center;
    white-space: nowrap;
    margin-right: 25px;
}

.DialogFrom {
    display: flex;
    width: 100%;
    align-items: center;
    margin-bottom: 20px;
}

.DialogFrom > div:nth-child(1) {
    width: 150px;
    text-align: right;
    flex-shrink: 0;
}

.ListInput {
    display: flex;
}

.ListInput > div {
    display: flex;
    align-items: center;
}
</style>